<div ng-controller="timepickerDemoCtrl">
    <uix-timepicker ng-disabled="isDisabled" format="'HH:mm:ss'" ng-model="time" placeholder="我是placeholder"></uix-timepicker>
    <div class="row">
        <div class="col-md-9">
            <uix-timepicker minute-step="10" format="'hh:mm:ss a'" ng-model="time" placeholder="timepicker"></uix-timepicker>
        </div>
        <div class="col-md-3">
            <pre>time:{{time | date:'HH:mm:ss'}}</pre>
        </div>
    </div>
    <hr/>
    <div class="row">
        <div class="col-md-9">
            <uix-timepicker format="'HH:mm:ss'" ng-model="time2"></uix-timepicker>
        </div>
        <div class="col-md-3">
            <pre>time2:{{time2 | date:'HH:mm:ss'}}</pre>
        </div>
    </div>
    <div class="row">
        <div class="col-md-9">
            <uix-timepicker readonly-input="readonlyInput" ng-model="time2"></uix-timepicker>
        </div>
        <div class="col-md-3">
            <label for="readonlyInput">
                readonlyInput: <input id="readonlyInput" type="checkbox" ng-model="readonlyInput">
            </label>
            <pre>{{readonlyInput}}</pre>
        </div>
    </div>
    <div class="row">
        <div class="col-md-9">
            <uix-timepicker on-change="onChange()" min-time="minTime" ng-model="time"></uix-timepicker>
        </div>
        <div class="col-md-3">
            <pre>minTime:{{minTime | date:'HH:mm:ss'}}</pre>
        </div>
    </div>
    <div class="row">
        <div class="col-md-9">
            <uix-timepicker append-to-body="true" max-time="maxTime" ng-model="time2"></uix-timepicker>
        </div>
        <div class="col-md-3">
            <pre>maxTime:{{maxTime | date:'HH:mm:ss'}}</pre>
        </div>
    </div>
</div>